<template>
  <div class="content-main">
    <a-tabs v-model:activeKey="activeName" class="eTabs" @tab-click="handleClicks">
      <a-tab-pane v-for="(item, i) in currentMenus" :key="i" v-model:key="i.toString" :tab="item">
      </a-tab-pane>
    </a-tabs>
    <div class="cont-outer"><router-view></router-view></div>
  </div>
  <!-- <LoadingImage v-show="isLoading"></LoadingImage> -->
</template>
<script setup>
import { ref, onMounted } from 'vue';
import { message } from 'ant-design-vue';
import { Interface } from '@/api/create/create.js';
import LoadingImage from '@/components/loadingComponent/index.vue';
import { useRouter } from 'vue-router';
const router = useRouter();

const activeName = ref('0');
const currentMenus = ref(['公文办理']);
// tab切换
let handleClicks = val => {
  localStorage.removeItem('startingActive');
  sessionStorage.removeItem('startingActive'); // 公文首发
  sessionStorage.removeItem('startingActives'); // 公文办理
  sessionStorage.removeItem('startingActivesss'); // 公文库
  handleClick(val);
  sessionStorage.removeItem('tabsActive'); //
};
let handleClick = val => {
  activeName.value = val;
  if (currentMenus.value[val] === '公文收发') {
    router.push({ name: 'create' });
  } else if (currentMenus.value[val] === '公文办理') {
    router.push({ path: '/index/handle' });
  } else if (currentMenus.value[val] === '公文交换') {
    router.push({ path: '/index/exchange' });
  } else if (currentMenus.value[val] === '公文库') {
    router.push({ path: '/index/library' });
  }
  // sessionStorage.removeItem('tabsActive'); //
};

const isLoading = ref(false);
function getMenuList() {
  // isLoading.value = true;
  let params = {};
  Interface.GetMenuList(params)
    .then(res => {
      if (res.code === 200) {
        // checkTerminal([]);
        checkTerminal(res.data.menuList);
      } else {
        handleClick(0);
        // message.error(res.msg); // 未绑定角色
      }
    })
    .finally(() => {
      console.log(1111);
      isLoading.value = false;
    })
    .catch(() => {
      isLoading.value = false;
      handleClick(0);
      console.log(4444);
    });
}
onMounted(() => {
  getMenuList();
});
// todo: 将PC端菜单和功能权限记录到本地
function checkTerminal(menuList) {
  if (menuList.length === 0) {
    handleClick(0);
  } else {
    for (let i = 0; i < menuList.length; i++) {
      let terminal = menuList[i];
      if (terminal.menuName === '应用端') {
        // 包含公文收发 并且包含电脑端
        localStorage.removeItem('公文收发');
        localStorage.removeItem('公文库');
        localStorage.removeItem('待归档');
        localStorage.removeItem('已归档');
        checkMenuList(terminal.documentPermissionsMenuVos, '电脑端');
        return;
      } else {
        handleClick(0);
      }
    }
  }
}
function checkMenuList(permissionMenu, name) {
  if (!permissionMenu) {
    return;
  }
  let menus = [];
  for (let i = 0; i < permissionMenu.length; i++) {
    let menu = permissionMenu[i];
    if (menu.menuName.indexOf('公文收发') !== -1 && menu.menuName.indexOf('电脑端') !== -1) {
      menus.push('公文收发');
      checkMenuList(menu.documentPermissionsMenuVos, '公文收发');
    } else if (menu.menuName.indexOf('公文库') !== -1 && menu.menuName.indexOf('电脑端') !== -1) {
      checkMenuList(menu.documentPermissionsMenuVos, '公文库');
      menus.push('公文库');
    } else {
      // 直接存 直接取
      menus.push(menu.menuName);
      checkMenuList(menu.documentPermissionsMenuVos, menu.menuName);
    }
  }
  if (name === '电脑端') {
    currentMenus.value = [];
    if (menus.indexOf('公文收发') !== -1) {
      currentMenus.value.push('公文收发');
    }

    currentMenus.value.push('公文办理'); // 顺序不要变  公文办理-所有人都能用

    if (menus.indexOf('公文交换') !== -1) {
      currentMenus.value.push('公文交换');
    }
    if (menus.indexOf('公文库') !== -1) {
      currentMenus.value.push('公文库');
    }
    if (sessionStorage.getItem('tabsActive')) {
      currentMenus.value.forEach((item, index) => {
        if (item === sessionStorage.getItem('tabsActive')) handleClick(index * 1);
      });
    } else {
      handleClick(0);
    }
  } else if (name === '公文收发' || name === '公文库' || name === '待归档' || name === '已归档') {
    localStorage.setItem(name, JSON.stringify(menus));
  }
}
</script>
<style lang="less" scoped>
@import './index.less';
</style>
